<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page import="com.BMS.entity.Book.*"%>
<%@ page import="com.BMS.entity.Manager.*"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>图书管理系统</title>

<link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css">

<script src="../js/jquery-1.11.2.min.js" type="text/javascript"></script>
<script src="../js/bootstrap.js" type="text/javascript"></script>

<!-- 使按键失效，用于权限控制  -->
<style type="text/css">
.disable {
	style ="pointer-events: none";
}
</style>

<!-- 导航栏图书检索 -->
<script type="text/javascript">
	function toSearch() {
		window.location.href = "./BookSearch.jsp?book_id=" + document.getElementById("book_id").value;
	}
</script>

<!-- 初次加载页面 -->
<script type="text/javascript">
	window.onload=function() {
		var nowPage = parseInt(document.getElementById("nowPage").value);
		var orderBy = document.getElementById("orderBy").value;
		ajax(nowPage,orderBy);
	}
</script>

<!-- 上一页按钮事件 -->
<script type="text/javascript">
	function lastPage() {
		var nowPage = document.getElementById("nowPage");
		var orderBy = document.getElementById("orderBy").value;
		if(nowPage.value<=1) {
			alert("已经是第一页！");
		} else {
			nowPage.value--;
			ajax(nowPage.value,orderBy);
		}
	}
</script>

<!-- 下一页按钮事件 -->
<script type="text/javascript">
	function nextPage() {
		var nowPage = document.getElementById("nowPage");
		var pageCount = document.getElementById("pageCount").value;
		var orderBy = document.getElementById("orderBy").value;
		if(nowPage.value==pageCount) {
			alert("已经是最后一页！");
		} else {
			nowPage.value++;
			ajax(nowPage.value,orderBy);
		}
	}
</script>

<!-- 页码条按钮事件 -->
<script type="text/javascript">
	function turnTo(obj) {
		var nowPage = obj.getAttribute("value");
		document.getElementById("nowPage").value = nowPage;
		var orderBy = document.getElementById("orderBy").value;
		ajax(nowPage,orderBy);
	}
</script>

<!-- 异步请求数据 -->
<script type="text/javascript">
	function ajax(nowPage,orderBy) {
		$.ajax({
			type:"GET",
			url:"./showBook.do",
			data:{nowPage:nowPage,orderBy:orderBy},
			dataType:"json",
			success:function(data) {
				var code = data.code;
				if(data.code=="200") {
					// 获取数据成功
					updateTable(data);
					
				} else if(data.code=="401") {
					// 暂无记录
					alert(data.msg);
				} else if(data.code=="402") {
					// 当前页码错误
					alert("402");
				} else {
					// 未知错误
					alert("500");
				}
			},
			error:function() {
				alert("发送请求失败!");
			}
		});
	}
</script>

<!-- 渲染表格 -->
<script type="text/javascript">
	function updateTable(data) {
		var tbody = document.createElement("tbody");
		tbody.setAttribute("id","bookList");
	
		var tbody_old = document.getElementById("bookList");
		
		var bookList = JSON.parse(data.bookList);
	
		//alert("0");
		//var bookList = new Array();
		for(var i = 0; i < bookList.length; i++) {
			var tr = document.createElement("tr");
		tr.style = "width:100%; height:7%;";
		
		var td1 = document.createElement("td");
		td1.innerHTML = bookList[i].book_ID;
		
		var td2 = document.createElement("td");
		td2.innerHTML = bookList[i].title;
		
		//alert("${book.getAuthor()}");
		
		var td3 = document.createElement("td");
		td3.innerHTML = bookList[i].type;
		
		var td4 = document.createElement("td");
		td4.innerHTML = bookList[i].author;
		
		var td5 = document.createElement("td");
		td5.innerHTML = bookList[i].publisher;
		
		var td6 = document.createElement("td");
		td6.innerHTML = bookList[i].publish_date;
		
		var td7 = document.createElement("td");
		td7.innerHTML = bookList[i].price;
		
		var td8 = document.createElement("td");
	
		var a1 = document.createElement("a");	
		a1.setAttribute("data-toggle", "modal");
		a1.setAttribute("data-target", "#editor");
		a1.setAttribute("onclick", "getImfo(this)");
		a1.innerHTML = "编辑";
		var a2 = document.createElement("a");
		a2.setAttribute("onclick","bookDel(this)");
		a2.innerHTML = "下架";
		var label = document.createElement("label");
		label.innerHTML = "&nbsp;&nbsp;&nbsp;";
		
		td8.appendChild(a1);
		td8.appendChild(label);
		td8.appendChild(a2);
		
		tr.appendChild(td1);
		tr.appendChild(td2);
		tr.appendChild(td3);
		tr.appendChild(td4);
		tr.appendChild(td5);
		tr.appendChild(td6);
		tr.appendChild(td7);
		tr.appendChild(td8);
		tbody.appendChild(tr);
		}
	
	document.getElementById("showArea").replaceChild(tbody,tbody_old);
	
		// 更新总页码
		// span
		var span_last = document.createElement("span");
		span_last.setAttribute("aria-hidden", "true");
		span_last.innerHTML = "<上一页";
		
		var span_next = document.createElement("span");
		span_next.setAttribute("aria-hidden", "true");
		span_next.innerHTML = "下一页>";
		
		// a
		var a_last = document.createElement("a");
		a_last.setAttribute("onclick", "lastPage()");
		a_last.setAttribute("aria-label", "Previous");
		
		var a_next = document.createElement("a");
		a_next.setAttribute("onclick", "nextPage()");
		a_next.setAttribute("aria-label", "Previous");
		
		// li
		var lastPage = document.createElement("li");
		lastPage.setAttribute("id", "lastPage");
		
		var nextPage = document.createElement("li");
		nextPage.setAttribute("id", "nextPage");
		
		// ul
        var pager = document.createElement("ul");
        pager.setAttribute("class","pagination");
        pager.setAttribute("id","pager");
        
        // 整合
        a_last.appendChild(span_last);
        lastPage.appendChild(a_last);
        
        a_next.appendChild(span_next);
        nextPage.appendChild(a_next);
        
        pager.appendChild(lastPage);
        pager.appendChild(nextPage);
		<!-- 渲染页数栏 -->
		var pageCount = data.pageCount;
		document.getElementById("pageCount").value = pageCount;
		
		for (var i = 0; i < pageCount; i++) {

			var a = document.createElement("a");
			a.setAttribute("href", "#");
			a.setAttribute("value", i + 1);
			a.setAttribute("onclick", "turnTo(this)");
			a.innerHTML = (i + 1);

			var li = document.createElement("li");
			li.appendChild(a);
			pager.insertBefore(li, nextPage);
		}
		
		// 更新页码条
		var old_pager = document.getElementById("pager");
		var pager_nav = document.getElementById("pager_nav");
		pager_nav.replaceChild(pager, old_pager);
	}
	
</script>

<!-- 编辑按钮事件 - 渲染模态框 -->
<script type="text/javascript">
	function getImfo(obj) {
		var parent = obj.parentElement.parentElement;
		var childs = parent.childNodes;

		document.getElementById("book_ID").innerHTML = childs[0].innerHTML;
		document.getElementById("title").value = childs[1].innerHTML;
		document.getElementById("type").value = childs[2].innerHTML;
		document.getElementById("author").value = childs[3].innerHTML;
		document.getElementById("publisher").value = childs[4].innerHTML;
		document.getElementById("publish_date").value = childs[5].innerHTML;
		document.getElementById("price").value = childs[6].innerHTML;

	}
</script>

<!-- 保存编辑事件 -->
<script type="text/javascript">
	function update() {
		var book_ID = document.getElementById("book_ID").innerHTML;
		var title = document.getElementById("title").value;
		var type = document.getElementById("type").value;
		var author = document.getElementById("author").value;
		var publisher = document.getElementById("publisher").value;
		var publish_date = document.getElementById("publish_date").value;
		var price = document.getElementById("price").value;
		
		var reg=/^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
		
		if(title.length==0) {
			alert("书名不能为空!");
		} else if(author.length==0) {
			alert("作者不能为空！");
		} else if(publisher.length==0) {
			alert("出版社不能为空！");
		} else if(publish_date.length==0) {
			alert("出版日期不能为空！");
		} else if(price.length==0) {
			alert("价格不能为空！");
		} else if(!publish_date.match(reg)) {
			alert("请输入正确的时间格式(yyyy-MM-dd)！");
		}else {
			$.ajax({
			type:"POST",
			url:"./bookUpdate.do",
			data:{book_ID:book_ID, title:title, type:type, author:author, publisher:publisher, publish_date:publish_date, price:price},
			dataType:"json",
			success:function(data) {
				if(data.code=="200") {
					// 成功
					alert(data.msg);
					var nowPage = parseInt(document.getElementById("nowPage").value);
					var orderBy = document.getElementById("orderBy").value;
					ajax(nowPage, orderBy);
				} else if(data.code=="401") {
					// 图书不存在
					alert(data.msg);
				} else {
					alert("未知错误！");
				}
			},
			error:function() {
				alert("保存失败！");
			}
		});
		}
		
		
	}
</script>

<!-- 下架按钮事件 -->
<script type="text/javascript">
	function bookDel(obj) {
		var parent = obj.parentElement.parentElement;
		var childs = parent.childNodes;
		var book_id = childs[0].innerHTML;
		var manager_id = '${user.manager_ID}';
		var takeOff_date = new Date().toLocaleDateString();
		if(book_id.length==0) {
			alert("删除失败，记录异常！");
		} else {
			$.ajax({
				type:"POST",
				url:"./bookDel.do",
				data:{book_id:Number(book_id),manager_id:manager_id,takeOff_date:takeOff_date},
				dataType:"json",
				success:function(data) {
					if(data.code=="200") {
						// 成功
						alert(data.msg);
						var nowPage = parseInt(document.getElementById("nowPage").value);
						var orderBy = document.getElementById("orderBy").value;
						ajax(nowPage, orderBy);
					} else if(data.code=="401") {
						// 该图书不存在
						alert(data.msg);
					} else {
						alert("未知错误！");
					}
				},
				error:function() {
				
				}
			});
		}
	}
</script>

<!-- 图书上架按钮事件 -->
<script type="text/javascript">
	function takeOn() {
		var book_ID = document.getElementById("takeOn_book_ID").value;
		var title = document.getElementById("takeOn_title").value;
		var type = document.getElementById("takeOn_type").value;
		var author = document.getElementById("takeOn_author").value;
		var publisher = document.getElementById("takeOn_publisher").value;
		var publish_date = document.getElementById("takeOn_publish_date").value;
		var price = document.getElementById("takeOn_price").value;
		var user = JSON.parse('<%= session.getAttribute("user") %>');
		var manager_id = user.manager_ID;
		var takeOn_date = new Date().toLocaleDateString();
		
		var reg=/^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
		
		//alert(manager_id);
		if(book_ID.length==0) {
			alert("图书编号不能为空！");
		} else if(title.length==0) {
			alert("书名不能为空");
		} else if(author.length==0) {
			alert("作者不能为空！");
		} else if(publisher.length==0) {
			alert("出版社不能为空！");
		} else if(publish_date.length==0) {
			alert("出版日期不能为空！");
		} else if(price.length==0) {
			alert("价格不能为空！");
		} else if(!publish_date.match(reg)) {
			alert("请输入正确的时间格式(yyyy-MM-dd)！");
		} else {
			$.ajax({
				type:"POST",
				url:"./bookTakeOn.do",
				data:{book_ID:book_ID, title:title, type:type, author:author, publisher:publisher, publish_date:publish_date, price:price, manager_id:manager_id, takeOn_date:takeOn_date},
				dataType:"json",
				success:function(data) {
					if(data.code=="200") {
						// 上架成功
						alert(data.msg);
						var nowPage = parseInt(document.getElementById("nowPage").value);
						var orderBy = document.getElementById("orderBy").value;
						ajax(nowPage, orderBy);
					} else if(data.code=="401") {
						// 图书编号已存在
						alert(data.msg);
					} else {
						alert("未知错误！");
					}
				},
				error:function() {
					// 提交请求失败
					alert("提交图书信息失败！");
				}
			});
		}
	}
</script>

</head>

<body>

	<!-- 大背景 -->
	<div class="container" align="center"
		style=" width:auto; height:768px; background-color:#BFEDEA; background-image:url(../img/bg2.png); -moz-background-size:100% 100%; background-size:100% 100%;">

		<!-- 导航栏 -->
		<div style="width:100%; height:auto;">
			<nav class="navbar navbar-default">
				<div class="container-fluid">
					<!-- Brand and toggle get grouped for better mobile display -->
					<div class="navbar-header">

						<a class="navbar-brand" href="../main.jsp">首页</a>
					</div>
					<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse" id="defaultNavbar1">
						<ul class="nav navbar-nav">
							<!-- 图书管理下拉框 -->
							<li class="dropdown"><a href="#" class="dropdown-toggle"
								data-toggle="dropdown" role="button" aria-expanded="false">图书管理<span
									class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a id="bookManage" href="./BookManage.jsp">管理图书</a></li>
									<li><a id="bookSearch" href="./BookSearch.jsp">图书查询</a></li>
									<li><a id="bookBorrow" href="./BookBorrow.jsp">图书借阅</a></li>
									<li><a id="bookReturn" href="./BookReturn.jsp">图书归还</a></li>
								</ul></li>

							<!-- 违规管理下拉框 -->
							<li class="dropdown" id="violation_manage"><a href="#"
								class="dropdown-toggle" data-toggle="dropdown" role="button"
								aria-expanded="false">违规管理<span class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a href="../Violation/ViolationManage.jsp">管理违规记录</a></li>
									<li><a href="../Violation/ViolationReg.jsp">违规登记</a></li>
								</ul></li>

							<!-- 个人中心下拉框 -->
							<li class="dropdown"><a href="#" class="dropdown-toggle"
								data-toggle="dropdown" role="button" aria-expanded="false">个人中心<span
									class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a href="../User/PersonalImfo.jsp">个人资料</a></li>
									<li id="bookHistory"><a href="../User/BookHistory.jsp">借阅记录</a></li>
									<li id="violationHistory"><a
										href="../User/ViolationHistory.jsp">违规记录</a></li>
									<li><a href="../User/Logout.do">退出登录</a></li>
								</ul></li>

						</ul>
						<!-- 搜索栏 -->
						<div style="float:right;">
							<form class="navbar-form navbar-left" role="search">
								<div class="form-group">
									<input type="text" id="book_id" class="form-control"
										placeholder="输入图书编号">
								</div>
								<button type="button" class="btn btn-default"
									onclick="toSearch()">查询</button>
							</form>
						</div>

					</div>
					<!-- /.navbar-collapse -->
				</div>
				<!-- /.container-fluid -->
			</nav>
		</div>

		<!-- 显示区域 -->
		<div class="container"
			style="width:80%; height:85%; background-color:rgba(255, 255, 255, 0.5)">
			<div align="center" style="text-align:center;">
				<label style="margin:15px 0 0 0; font-family:华文行楷; font-size:35px;">图书管理</label>
				<button type="button" data-toggle="modal" data-target="#takeOn"
					style="float:right; margin-top:50px; background-color:#3C9C92">+&nbsp;&nbsp;图书上架</button>
				<hr>
			</div>
			<table id="showArea" class="table-hover table-striped" border="1"
				cellspacing="0"
				style="font-size:18px; width:100%; height:75%;border-collapse:collapse; text-align:center; margin:1% auto auto auto;">
				<thead style="background-color:#3C9C92;">
					<td onclick="location='./showBook.do?orderBy=book_ID'">图书编号</td>
					<td onclick="location='./showBook.do?orderBy=title'">书名</td>
					<td onclick="location='./showBook.do?orderBy=type'">图书类型</td>
					<td onclick="location='./showBook.do?orderBy=author'">作者</td>
					<td onclick="location='./showBook.do?orderBy=publisher'">出版社</td>
					<td onclick="location='./showBook.do?orderBy=publish_date'">出版日期</td>
					<td onclick="location='./showBook.do?orderBy=price'">价格</td>
					<td>操作</td>
				</thead>
				<tbody id="bookList">
				</tbody>
			</table>
			<!-- 页码条 -->
			<div class="container" style="width:100%;height:8%">
				<nav id="pager_nav">
					<!-- Add class .pagination-lg for larger blocks or .pagination-sm for smaller blocks-->
					<ul class="pagination" id="pager">
						<li id="lastPage"><a aria-label="Previous"
							onclick="lastPage()"><span aria-hidden="true"><上一页</span></a></li>
						<li id="nextPage"><a aria-label="Next" onclick="nextPage()"><span
								aria-hidden="true">下一页></span></a></li>
					</ul>
				</nav>
			</div>
		</div>
		<input type="hidden" id="nowPage" value="1" /> <input type="hidden"
			id="pageCount" value="" /> <input type="hidden" id="orderBy"
			value="book_ID" />
	</div>

	<!-- 编辑模态框（Modal） -->
	<div class="modal fade" id="editor" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">编辑</h4>
				</div>
				<div class="modal-body">
					<table>
						<tr>
							<td>图书编号：</td>
							<td><label id="book_ID"></label></td>
						</tr>
						<tr>
							<td>书名：</td>
							<td><input type="text" id="title" /></td>
						</tr>
						<tr>
							<td>图书类型：</td>
							<td><select id="type">
									<option value="A" selected="selected">A</option>
									<option value="B">B</option>
							</select></td>
						</tr>
						<tr>
							<td>作者：</td>
							<td><input type="text" id="author" /></td>
						</tr>
						<tr>
							<td>出版社：</td>
							<td><input type="text" id="publisher" /></td>
						</tr>
						<tr>
							<td>出版日期:</td>
							<td><input type="text" id="publish_date" /></td>
						</tr>
						<tr>
							<td>价格：</td>
							<td><input type="text" id="price" /></td>
						</tr>

					</table>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-primary" onclick="update()">保存更改</button>
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				</div>
			</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal -->
		</div>

		<!-- 图书上架模态框（Modal） -->
		<div class="modal fade" id="takeOn" tabindex="-1" role="dialog"
			aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">图书上架</h4>
					</div>
					<div class="modal-body">
						<table>
							<tr>
								<td>图书编号：</td>
								<td><input type="text" id="takeOn_book_ID"></td>
							</tr>
							<tr>
								<td>书名：</td>
								<td><input type="text" id="takeOn_title" /></td>
							</tr>
							<tr>
								<td>图书类型：</td>
								<td><select id="takeOn_type">
										<option value="A" selected="selected">A</option>
										<option value="B">B</option>
								</select></td>
							</tr>
							<tr>
								<td>作者：</td>
								<td><input type="text" id="takeOn_author" /></td>
							</tr>
							<tr>
								<td>出版社：</td>
								<td><input type="text" id="takeOn_publisher" /></td>
							</tr>
							<tr>
								<td>出版日期:</td>
								<td><input type="text" id="takeOn_publish_date" /></td>
							</tr>
							<tr>
								<td>价格：</td>
								<td><input type="text" id="takeOn_price" /></td>
							</tr>

						</table>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" onclick="takeOn()">提交信息</button>
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal -->
			</div>
			
</body>

<!-- 权限控制 -->
<script type="text/javascript">
 	var user_type = "<%=session.getAttribute("user_type")%>";
 	if(user_type!=null) {
 		if(user_type=="reader") {
			document.getElementById("bookManage").style['pointer-events'] = 'none';
			document.getElementById("bookBorrow").style['pointer-events'] = 'none';
			document.getElementById("bookReturn").style['pointer-events'] = 'none';
 		} else {
 			document.getElementById("bookHistory").style['pointer-events'] = 'none';
 			document.getElementById("violationHistory").style['pointer-events'] = 'none';
 		}
 	}
</script>

</html>
